<template>
  <el-card class="box-card" style="width: 1180px">
    <!--表格-->
    
    <el-button type="info" @click="downExcel">数据导出</el-button>
    
     <!-- <el-col :span="4">
               <el-upload
                   class="clearfix"
                   action="#"
                   name="excel"
                   :on-progress="onExcelProgress"
                   :on-success="handleExcelSuccess"                   
                   accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
                   multiple
                   :limit="1">
                <el-button  type="info">数据导入</el-button>
               </el-upload>
         </el-col> -->

    <el-table :data="logList" stripe style="width: 100%">
      <el-table-column prop="slId" label="id" width="180" hidden>
      </el-table-column>
      <el-table-column prop="slLoginUser" label="管理员" width="180">
      </el-table-column>
      <el-table-column prop="slLoginTime" label="登陆时间" width="180">
      </el-table-column>
      <el-table-column prop="slIp" label="登陆IP"> </el-table-column>

      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-popconfirm
            title="这是一段内容确定删除吗？"
            @confirm="handleDelete(scope.row.slId)"
          >
            <el-button size="mini" slot="reference" type="danger"
              >删除</el-button
            >
          </el-popconfirm>
        </template>
      </el-table-column>
    </el-table>
    <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="query.pageIndex"
      :page-sizes="pageInfo.pageSizes"
      :page-size="query.pageSize"
      layout="total, sizes, prev, pager, next, jumper"
      :total="pageInfo.total"
    >
    </el-pagination>
  </el-card>
</template>

<script>
export default {
  name: "Admin",
  data() {
    return {
      logList: [],
      pageInfo: {
        pageSizes: [5, 10, 20, 50],
        total: "",
        pages: "",
      },
      //封装的请求参数
      query: {
        pageIndex: 1,
        pageSize: 5,
      },
    };
  },
  methods: {
    //文件上传成功的钩子函数
    handleExcelSuccess(res, result) {
      this.$message.success("导入成功");
      if (result.response.success) {
        this.load();
      }
    },
    // 上传中
    onExcelProgress() {},
    //文件导出到Excel
    downExcel() {
      window.location.href = "http://localhost:9000/adminLog/excel";
    },

    //当每页显示条数改变时
    handleSizeChange(size) {
      this.query.pageSize = size;
      this.loadSystemLogin();
    },
    //当页数改变时
    handleCurrentChange(currentPage) {
      this.query.pageIndex = currentPage;
      this.loadSystemLogin();
    },
    loadSystemLogin() {
      this.$axios
        .post("adminLog/queryAllSystemLogin", this.query)
        .then((res) => {
          this.logList = res.data.data.list;
          this.pageInfo.total = res.data.data.total;
        });
    },

    handleDelete(id) {
      this.$axios
        .delete("adminLog/deleteSL/" + id)
        .then((res) => {
          if (res.data.code == 200) {
            this.$message.success("删除成功");
            this.loadSystemLogin();
          } else {
            this.$message.info("删除失败");
          }
        })
        .catch((error) => {
          this.$message.error("出错了！请稍后重试");
        });
    },
  },
  mounted() {
    this.loadSystemLogin();
  },
};
</script>

<style scoped>
</style>
